
<div class="row">
    <div class="col s12 m6" ng-if="!reser_done">
        <div class="card blue-grey darken-1">
            <div class="card-content white-text">
                <span class="card-title">Booking recap</span>
                <p>Check-in  : {{start_dt}}</p>
                <p>Check-out  : {{end_dt}}</p>
                <p>Passenger : {{occupancy}}</p>
                <p>Room : {{room_info.name}}</p>
                <p>Total price : {{room_info.total_price}}</p>
            </div>
        </div>
    </div>
    <div class="col s12 m6" ng-if="!reser_done">
        <div class="card-panel">
            <form >
                <h4>Customer info</h4>
                <div class="row">
                    <div class="input-field col s6">
                        <input  id="first_name" type="text" ng-model="customer.first_name" >
                        <label for="first_name">First Name</label>
                    </div>
                    <div class="input-field col s6">
                        <input id="last_name" type="text" ng-model="customer.last_name" >
                        <label for="last_name">Last Name</label>
                    </div>
                </div>
                <div class="row">
                    <div class="input-field col s12">
                        <input id="email" type="email" ng-model="customer.email" >
                        <label for="email">Email</label>
                    </div>
                </div>
                <button class="btn" ng-click="book()">Book</button>
            </form>
        </div>
    </div>
</div>

<div class="row">
    <div class="col s12 m4 offset-m4" ng-if="reser_done">
        <div class="card blue darken-2">
            <div class="card-content white-text">
                <span class="card-title"> <h2>Reservation</h2></span>
                <h4>Customer info</h4>
                <p>Name : {{reservation_info.customer.first_name}}</p>
                <p>Last name : {{reservation_info.customer.last_name}}</p>
                <p>Email : {{reservation_info.customer.email}}</p>
                <h4>Reservation info</h4>
                <p>Check-in : {{reservation_info.checkin}}</p>
                <p>Check-out : {{reservation_info.checkout}}</p>
                <p>Adults : {{reservation_info.occupancy}}</p>
                <p>Total Price : {{reservation_info.total_price}}</p>
                <h4>Nights info</h4>
                <p ng-repeat="night in reservation_info.nights">
                    Day {{night.day}}  -  Rate : {{night.rate}}
                </p>
                <a href="#/pay/{{reservation_info.id}}" style="text-align: center"><button class="btn">Pay ${{reservation_info.total_price}}</button></a>
            </div>
        </div>
    </div>
</div>

